﻿var temp,isedit=false,issort=false;
$(document).ready(function () {

    $('#sortable div.keyword').click(keywordclick);

    $('#sortable').sortable({            //关键字排序
        update: function (event, ui) {
            updatekeywordlist();
            issort = true;
        }
    });
    $("#sortable").disableSelection();
    $('#addkeyword').click(addkeyword);
});

function updatekeywordlist(){
    var keywordlist=$("#sortable").sortable("serialize", { key: 'keyword' });
    $('#keywordlist').attr('value',keywordlist);
}
function addkeyword() {               //新增关键字
    if (document.getElementById('keywordedit') != null)
        return;

    var newkeyword = $('#sortable div:first-child').clone(true);
    if (newkeyword.length == 0) {
        $('#sortable').html('<div class="keyword"></div>');
        newkeyword = $('#sortable div:first-child');
        $('#sortable div.keyword').click(keywordclick);
    }
    newkeyword.attr('id','keyword_0@新关键字');  //the new keyword's id is set to 0 by default
    newkeyword.appendTo($('#sortable'));
    newkeyword.text("新关键词");
    updatekeywordlist();
}

function keywordclick() {
    if (isedit == false) {      //排除一种特殊情况：同时点击两个div元素成编辑状态从而导致出错，现在每次只能编辑一个div元素
        if (issort == true) {   //当在拖动时发生的点击事件，不进入编辑状态
            issort = false;
            return;
        }
        if ($(this).children().length == 0) {
            temp = $(this).text();
            $(this).html('<input type="text" value="' + temp + '" id="keywordedit" style="width:50px"/>');
            document.getElementById('keywordedit').focus();
            isedit = true;
            $('#keywordedit').blur(function () {
                temp = $(this).attr('value');  //input元素的内容由其value属性确定
                if (temp != "") {
                    //----------------------------------------//修改关键字
                    var orgid = $(this).parent().attr('id');
                    $(this).parent().attr('id', orgid.substr(0, orgid.indexOf('@') + 1).concat(temp));
                    $(this).parent().text(temp); //div元素的内容由其text确定
                    updatekeywordlist();
                }
                else {
                    $(this).parent().remove();     //删除关键字
                    updatekeywordlist();

                }
                $(this).remove();
                isedit = false;
            })
        }
    }
}
